<style lang="less">
  @import '../styles/common.less';
  @import '../tables/components/table.less';
</style>

<template>
  <div>
    <Row :gutter="10">
      <Card>
        <div class="table-head">
          <div class="left">
            <Select v-model="searchSource" :transfer="true" @on-change="onChangeSearchSource">
              <Option v-for="item in searchSourceArr" :value="item.id" :key="item.id">{{ item.name }}</Option>
            </Select>
          </div>
          <div class="left text-align-center">
            在线人数：{{online_number > 0 ? online_number : 0}}人
          </div>
          <Button type="primary" class="Button" @click="reset()">重置</Button>
        </div>
        <Row class="margin-top-10">
          <Table stripe border :columns="columns" :data="data" @on-sort-change="onSortChange"
                 @on-selection-change="selectionChange"></Table>
        </Row>
        <div style="margin: 10px;overflow: hidden;height: 36px;">
          <div style="float: right;">
            <Page :total="total" :current="page" @on-change="changePage" show-elevator></Page>
          </div>
        </div>
      </Card>
      <!--重置-->
      <Modal v-model="addCurrentTableData" :width="600" :mask-closable="false" :closable="false"
             class-name="vertical-center-modal" class="Modal-Detail-div Modal-Detail-height">
        <h3 slot="header" style="color:#2D8CF0">重置</h3>
        <Form label-position="top">
          <FormItem label="功能模块">
            <Select v-model="reset_type" :transfer="true" style="width:100%;">
              <Option v-for="item in searchTypeArr" :value="item.id" :key="item.id">{{ item.name }}</Option>
            </Select>
          </FormItem>
        </Form>
        <div slot="footer">
          <Button type="text" @click="hideAddModal">取消</Button>
          <Button type="primary" :loading="saveLoading" @click="save()">确定</Button>
        </div>
      </Modal>
    </Row>
  </div>
</template>

<script>
  import Cookies from 'js-cookie';
  import Util from '../../libs/util';
  import Utils from '../../libs/mod.utils';
  import String from '../../libs/mod.string';
  import Modal from '../../libs/mod.Modal';
  export default {
    components: {},
    data () {
      return {
        total: 0,
        page: 1,
        size: 10,
        sort: '',
        order: '',
        id: '',
        reset_type: 'all',
        searchType: 'all',
        searchSource: 'all',
        searchTypeArr: [],
        searchSourceArr: [
          {
            id: 'all',
            name: '全部',
          },
          {
            id: 'web',
            name: 'web',
          },
          {
            id: 'app',
            name: 'app',
          },
        ],
        showCurrentTableData: false,
        loading: true,
        showCurrentColumns: [],
        editInlineAndCellData: [],
        columns: [
          {
            type: 'selection',
            width: 60,
            align: 'center',
            fixed: 'left'
          },
          {
            key: 'u.name',
            title: '姓名',
            minWidth: 100,
            sortable: 'custom',
            align: 'center',
            fixed: 'left',
            render: (h, params) => {
              var username = params.row.username;
              return h('div', [
                h('span', username)
              ]);
            }
          },
          {
            key: 'source',
            title: '来源',
            minWidth: 80,
            align: 'center',
            fixed: 'left',
            sortable: 'custom',
          },
          {
            key: 'chat_time',
            title: '消息',
            minWidth: 200,
            align: 'center',
            sortable: 'custom',
            render: (h, params) => {
              var seconds = params.row.chat_time;
              if (seconds >= 0) {
                seconds = Utils.timesToTime(seconds);
              }
              return h('div', [
                h('span', seconds)
              ]);
            }
          },
          {
            key: 'task_time',
            title: '任务',
            minWidth: 200,
            align: 'center',
            sortable: 'custom',
            render: (h, params) => {
              var seconds = params.row.task_time;
              if (seconds >= 0) {
                seconds = Utils.timesToTime(seconds);
              }
              return h('div', [
                h('span', seconds)
              ]);
            }
          },
          {
            key: 'journal_time',
            title: '日志',
            minWidth: 200,
            align: 'center',
            sortable: 'custom',
            render: (h, params) => {
              var seconds = params.row.journal_time;
              if (seconds >= 0) {
                seconds = Utils.timesToTime(seconds);
              }
              return h('div', [
                h('span', seconds)
              ]);
            }
          },
          {
            key: 'schedule_time',
            title: '日程',
            minWidth: 200,
            align: 'center',
            sortable: 'custom',
            render: (h, params) => {
              var seconds = params.row.schedule_time;
              if (seconds >= 0) {
                seconds = Utils.timesToTime(seconds);
              }
              return h('div', [
                h('span', seconds)
              ]);
            }
          },
          {
            key: 'knowledge_time',
            title: '知识库',
            minWidth: 200,
            align: 'center',
            sortable: 'custom',
            render: (h, params) => {
              var seconds = params.row.knowledge_time;
              if (seconds >= 0) {
                seconds = Utils.timesToTime(seconds);
              }
              return h('div', [
                h('span', seconds)
              ]);
            }
          },
          {
            key: 'work_style_time',
            title: '工作风采',
            minWidth: 200,
            align: 'center',
            sortable: 'custom',
            render: (h, params) => {
              var seconds = params.row.work_style_time;
              if (seconds >= 0) {
                seconds = Utils.timesToTime(seconds);
              }
              return h('div', [
                h('span', seconds)
              ]);
            }
          },
          {
            key: 'city_time',
            title: '城市管理',
            minWidth: 200,
            align: 'center',
            sortable: 'custom',
            render: (h, params) => {
              var seconds = params.row.city_time;
              if (seconds >= 0) {
                seconds = Utils.timesToTime(seconds);
              }
              return h('div', [
                h('span', seconds)
              ]);
            }
          },
          {
            key: 'social_repo_time',
            title: '社会智库',
            minWidth: 200,
            align: 'center',
            sortable: 'custom',
            render: (h, params) => {
              var seconds = params.row.social_repo_time;
              if (seconds >= 0) {
                seconds = Utils.timesToTime(seconds);
              }
              return h('div', [
                h('span', seconds)
              ]);
            }
          },
          {
            key: 'regulate_time',
            title: '安全整治',
            minWidth: 200,
            align: 'center',
            sortable: 'custom',
            render: (h, params) => {
              var seconds = params.row.regulate_time;
              if (seconds >= 0) {
                seconds = Utils.timesToTime(seconds);
              }
              return h('div', [
                h('span', seconds)
              ]);
            }
          },
          {
            key: 'total_time',
            title: '总计',
            minWidth: 200,
            align: 'center',
            render: (h, params) => {
              var seconds = params.row.total_time;
              if (seconds >= 0) {
                seconds = Utils.timesToTime(seconds);
              }
              return h('div', [
                h('span', seconds)
              ]);
            }
          },
        ],
        data: [],
        dataDetail: {},
        initTable: [],
        addCurrentTableData: false,
        saveLoading: false,
        selectionArr: [],
        online_number: 0,// 在线人数
      };
    },
    created: function () {
      var _this = this;
      _this.getData();
      _this.getSearchTypeArr();
      _this.get_online_number();
    },
    mounted () {
      var _this = this;
    },
    methods: {
      // 在线人数
      get_online_number () {
        var _this = this;
        var data = {
          uid: Util.toJson(localStorage.getItem('userInfo')).id,
        };
        var params = {
          url: '/user/getActive',
          type: Util.method.get,
          data: data,
          success: _successFun
        };
        Util.ajax(_this, params);
        function _successFun(res) {
          if (res.result == 0) {
            var _data = res.data || 0;
            _this.online_number = _data;
          } else {
            _this.$Message.error('查询在线人数失败!');
          }
        }
      },
      onChangeSearchSource: function (val) {
        var _this = this;
        _this.searchSource = val;
        _this.page = 1;
        _this.getData();
      },
      onChangeSearchType: function (val) {
        var _this = this;
        _this.searchType = val;
        _this.page = 1;
        _this.getData();
      },
      getSearchTypeArr: function () {
        var _this = this;
        var typeObj = Util.constant.statistical_type;
        var searchTypeArr = [];
        searchTypeArr.push({id: 'all', name: '全部'});
        for (var k in typeObj) {
          if (!typeObj[k]) {
            continue;
          }
          var obj = {
            id: typeObj[k].id,
            name: typeObj[k].name,
          };
          searchTypeArr.push(obj);
        }
        _this.searchTypeArr = searchTypeArr;
      },
      // 排序
      onSortChange: function (data) {
        var _this = this;
        var column = data.column;
        var key = data.key;
        var order = data.order;
        if (order == 'asc' || order == 'desc') {
          _this.sort = key;
          _this.order = order;
          _this.getData();
        }
      },
      getData () {
        var _this = this;
        var searchSource = _this.searchSource == 'all' ? '' : _this.searchSource;
        var data = {
          uid: Util.toJson(localStorage.getItem('userInfo')).id,
          page: _this.page,
          size: _this.size,
          source: searchSource,
          sort: _this.sort,
          order: _this.order,
        };
        var params = {
          url: '/statistical-web/list',
          //domain: 'http://sd.jnaw.top/sd2-mock',
          type: Util.method.get,
          data: data,
          success: _successFun
        };
        Util.ajax(_this, params);
        function _successFun(res) {
          if (res.result == 0) {
            var _data = res.data || [];
            _this.total = res.rows;
            _this.data = _data;
          } else {
            _this.$Message.error('查询信息失败!');
          }
        }
      },
      changePage (page) {
        var _this = this;
        _this.page = page;
        _this.getData();
      },
      // 列表多选 选中数据
      selectionChange: function (selection) {
        var _this = this;
        _this.selectionArr = selection;
      },
      // 隐藏重置页面
      hideAddModal: function () {
        var _this = this;
        _this.addCurrentTableData = false;
      },
      // 显示重置界面
      reset: function () {
        var _this = this;
        _this.reset_type = 'all';
        _this.addCurrentTableData = true;
      },
      // 保存数据
      save: function () {
        var _this = this;
        var reset_type = _this.reset_type == 'all' ? '' : _this.reset_type;

        var data = {
          type: reset_type
        };
        var params = {
          url: '/statistical-web/reset',
          type: Util.method.get,
          data: data,
          success: _successFun
        };
        Util.ajax(_this, params);
        _this.saveLoading = true;
        function _successFun(res) {
          _this.saveLoading = false;
          if (res.result == 0) {
            _this.page = 1;
            _this.getData();
            _this.addCurrentTableData = false;
            _this.reset_type = 'all';
          } else {
            _this.$Message.error('重置信息失败!');
          }
        }
      },

    }
  };
</script>
